import * as types from "../types";
import {
  // getCategory,
  getCategoryAll,
  addCategory,
  deleteCategory,
  editCategory,
  getProductByGroup,
} from "../../api/product/index.js";
import { treeFilter, listToTree, treeForeach } from "../../utils/tree";
import Vue from "vue";

export default {
  state: {
    category: [],
    product: {},
  },
  getters: {
    // 生成树状的商品分类
    treeCategory(state) {
      let category = JSON.parse(JSON.stringify(state.category));
      category = listToTree(category);
      treeForeach(category, (node) => {
        if (node.children && node.children.length === 0) {
          delete node.children;
        }
      });
      return category;
      // return state.category;
    },
    // 生成两级的商品分类
    twoLevelCategory(state, getters) {
      const cate = JSON.parse(JSON.stringify(getters.treeCategory));
      cate.forEach((item) => {
        item.children &&
          item.children.forEach((subitem) => {
            delete subitem.children;
          });
      });

      return cate;
    },
    // 筛选商品分类， 返回树状结构的数据
    filterTreeCategory(state, getters) {
      return function (keyword) {
        if (keyword.trim()) {
          return treeFilter(getters.treeCategory, (node) => {
            return node.id === keyword || node.name.includes(keyword);
          });
        } else {
          return getters.treeCategory;
        }
      };
    },
    productIdList({ product }) {
      return Object.keys(product);
    },
    productList({ product }) {
      return Object.values(product);
    },
    // 根据传进来的商品id的数组  从缓存中查找对应的商品数据
    getProductList({ product }) {
      // arr = [20122, 20012, 20003]
      return function (arr) {
        return arr.map((id) => product[id]);
      };
    },
  },
  mutations: {
    [types.SET_CATEGORY](state, category) {
      state.category = category;
    },
    [types.DELETE_CATEGORY]({ category }, data) {
      const index = category.findIndex((item) => item.id === data.id);
      category.splice(index, 1);
    },
    [types.ADD_CATEGORY]({ category }, data) {
      category.push(data);
    },
    [types.EDIT_CATEGORY]({ category }, data) {
      const index = category.findIndex((item) => item.id === data.id);
      category.splice(index, 1, data);
    },

    // 添加商品到缓存 ， 把数组设置成对象的形式
    [types.SET_PRODUCT]({ product }, data) {
      data.forEach((item) => {
        Vue.set(product, item.id, item);
      });
    },
  },
  actions: {
    async [types.SET_CATEGORY]({ commit }) {
      // const { results } = await getCategory();
      const results = await getCategoryAll();
      commit(types.SET_CATEGORY, results);
    },
    // 增删改查的方法 都要有返回值
    async [types.ADD_CATEGORY]({ commit }, data) {
      const result = await addCategory(data);
      commit(types.ADD_CATEGORY, result);
      return result;
    },
    async [types.EDIT_CATEGORY]({ commit }, data) {
      const result = await editCategory(data);
      commit(types.EDIT_CATEGORY, result);
      return result;
    },
    async [types.DELETE_CATEGORY]({ commit }, data) {
      await deleteCategory(data);
      commit(types.DELETE_CATEGORY, data);
      return data;
    },

    // 异步获取商品列表数据， 根据商品id的数组来查找商品数据
    // data = [20123,12034, 12301]
    async [types.SET_PRODUCT]({ commit, state: { product } }, data) {
      if (!data || data.length === 0) return;
      // 先筛选一下，看要查找的数据的id在缓存中是否存在， 不存在则进行请求
      const arr = data.filter((id) => !product[id]);

      if (arr.length === 0) return;
      // 获取查询到的结构
      const result = await getProductByGroup({ group: arr });

      //添加到缓存中
      commit(types.SET_PRODUCT, result);
    },
  },
};
